.root {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    &::before, &::after {
        content: '';
        display: block;
        width: .4rem;
        height: .4rem;
        background: url(https://cdn.weipaitang.com/static/2017083053cb1d81-8790-453c-aa17-a472e619b566-W80H40) no-repeat center / .8rem .4rem;
    }
    &::before {
        background-position: 0 0;
        margin-left: .2rem;
    }
    &::after {
        background-position: -0.4rem 0;
        margin-right: .2rem;
    }
    .line {
        flex: none;
        position: relative;
        width: 5.76rem;
        height: 100%;
        &::before {
            display: block;
            content: '';
            position: absolute;
            width: 100%;
            //height: ;
            left: 0;
            top: 50%;
            border-bottom: 1px solid #d0d5e7;
            transform: translateY(-50%);
        }
        .tick{
            position: absolute;
            width: .56rem;
            height: .56rem;
            left: 0;
            top: 50%;
            transform: translate3d(-50%, -50%, 0);
            display: flex;
            justify-content: center;
            align-items: center;
            &::after {
                content: '';
                display: block;
                width: 0;
                height: .24rem;
                border-left: 1px solid #d0d5e7;
            }
        }
        .pointer {
            position: absolute;
            width: .56rem;
            height: .56rem;
            left: 0;
            top: 50%;
            transform: translate3d(-50%, -50%, 0);
            background: url(https://cdn.weipaitang.com/static/2017083085f19568-a8c6-400a-a9df-182e02d20a17-W56H56) no-repeat center / contain;
            &.transition {
                transition: left .3s ease;
            }
        }
    }
}